<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        table,
        td {
            border: 1px solid black;
        }

        table {
            /* width: 500px;
            height: 500px; */
            border-collapse: collapse;

        }

        td {
            text-align: center;
            vertical-align: top;
            padding: 20px;
            background-color: blueviolet;
            color: #ffffff;
        }
    </style>
</head>

<body>
    <!-- 
    表格属性
    border：边框
    border-collapse: 折叠边框 属性设置表格的边框是否折成一个单一的边框或隔开
    width、height:表格宽度和高度
    text-align: 表格文字水平对齐
    vertical-align:表格文字垂直对齐
    padding:内边距填充
    -->

    <table>
        <tr>
            <td>单元格</td>
            <td>单元格</td>
            <td>单元格</td>
            <td>单元格</td>
            <td>单元格</td>
        </tr>
        <tr>
            <td>单元格</td>
            <td>单元格</td>
            <td>单元格</td>
            <td>单元格</td>
            <td>单元格</td>
        </tr>
        <tr>
            <td>单元格</td>
            <td>单元格</td>
            <td>单元格</td>
            <td>单元格</td>
            <td>单元格</td>
        </tr>
        <tr>
            <td>单元格</td>
            <td>单元格</td>
            <td>单元格</td>
            <td>单元格</td>
            <td>单元格</td>
        </tr>
        <tr>
            <td>单元格</td>
            <td>单元格</td>
            <td>单元格</td>
            <td>单元格</td>
            <td>单元格</td>
        </tr>
    </table>
</body>

</html>